{extend name="property/public/insidePageBase" /}
{block name="title"}添加单元{/block}
{block name="body"}
<div class="layuimini-container">
    <div class="layuimini-main">
        <div class="layui-form  layui-form-pane">
            <div class="layui-form-item">
                <label class="layui-form-label indispensable">物业筛选</label>
                <div class="layui-input-block">
                    <select name="property_id" id="property_id" lay-search lay-filter="property_id">
                        <option value="">--请选择--</option>
                        {foreach $propertyData as $k=>$v}
                        <option value="{$v['id']}">{$v['name']}</option>
                        {/foreach}
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">楼栋选择</label>
                <div class="layui-input-block" id="unit_id_show">
                    <input type="text" name="pid" placeholder="请选择物业" disabled  autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">单元名称</label>
                <div class="layui-input-block">
                    <input type="text" name="unit_name" placeholder="请输入单元名称" class="layui-input" lay-verify="required" autocomplete="off"/>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">单元编号</label>
                <div class="layui-input-block">
                    <input type="text" name="unit_code" placeholder="请输入单元编号" class="layui-input" lay-verify="required" autocomplete="off"/>
                </div>
            </div>
            <div class="layui-form-item" pane="">
                <label class="layui-form-label">是否显示</label>
                <div class="layui-input-block">
                    <input type="radio" name="is_show" autocomplete="off" value="1" title="开启" checked>
                    <input type="radio" name="is_show" autocomplete="off" value="2" title="隐藏">
                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">备注说明</label>
                <div class="layui-input-block">
                    <textarea id="content" name="remark" placeholder="请输入备注说明" class="layui-textarea"></textarea>
                </div>
            </div>
            <div class="layui-form-item layui-hide">
                <button class="layui-btn" lay-submit lay-filter="submitBtn" id="submitBtn">提交</button>
            </div>
        </div>
    </div>
</div>
<script id="unit_id_tpl" type="text/html">
    <select name="pid" lay-filter="pid" id="pid">
        <option value="">--请选择物业--</option>
        {{# layui.each(d.unitList, function(index, elem) { }}
        <option value="{{elem.id}}">{{elem.unit_name}}</option>
        {{# }) }}
    </select>
</script>
{/block}
{block name="js"}
{__block__}
<script>
    layui.use([ 'form', 'layer', 'laytpl'], function () {
        var form = layui.form,layer = layui.layer,$ = layui.$,  laytpl = layui.laytpl;
        form.on('select(property_id)', function(res) {
            let value = res.value
            loadPropertyUnitList(value)
        })
        function loadPropertyUnitList(propertyId) {
            $.get('{:request()->url()}', {property_id:propertyId,get_type:'unitData'}, function(res) {
                if(res.code == 0) {
                    var getTpl = document.getElementById('unit_id_tpl').innerHTML; // 获取模板字符
                    var elemView = document.getElementById('unit_id_show'); // 视图对象
                    laytpl(getTpl).render({unitList:res.data}, function(str){
                        elemView.innerHTML = str;
                        form.render('select')
                    });
                }
            })
        }
    });
</script>
{/block}